<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>Document</title>
</head>

<body>

  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</body>

<script>
  // for...in... 遍历数组返回下标 遍历对象返回属性名
  // for...of...
  const arr = [1, 2, 3, 4, 5]
  for (const key in arr) {
    console.log(key)
  }

  let obj = {
    name: '李唯一',
    age: 18
  }
  for (const val in obj) {
    console.log(val);
  }
  // 直接遍历数组返回值 直接遍历对象报错
  for (const item of arr) {
    console.log(item)
  }
  // .kyes()拿到数组的下标
  for (const index of arr.keys()) {
    console.log(index, '----------')
  }
  // 
  for (const [index, item] of arr.entries()) {
    console.log(index, item, "======")
  }
  // arr.values() 拿到数组的值
  console.log('------')
  // Object.keys()拿到对象的属性名 并放到数组里
  console.log(Object.keys(obj))//['name']
  // Object.values()拿到对象的属性值 并放到数组里
  console.log(Object.values(obj))
  // Object.entries()拿到对象的属性名和属性值 并放到二维数组里
  console.log(Object.entries(obj))
  for (const keys of Object.keys(obj)) {
    console.log(keys);
  }

  // find()返回满足条件的第一个值
  let list = [{
    name: "李唯一",
    age: "18",
    like: "姜宁,左丘红婷"
  }, {
    name: "姜宁",
    age: "19",
    like: "李唯一"
  }, {
    name: "左丘红婷",
    age: "20",
    like: "李唯一"
  }]

  let found = list.find(function (val) {
    return val.name == "李唯一"
  })
  console.log(found, 'find')//返回的是值



  // findIndex() 满足条件的第一个元素的下标 否则返回-1 
  let foundIndex = list.findIndex(function (item) {
    return item.name == "李唯1"
  })
  console.log(foundIndex)
  // 伪数组转成数组
  let dom = document.querySelectorAll('div')
  console.log(dom instanceof Array) //false
  let div = Array.from(dom)
  console.log(div instanceof Array) //true

  // 剩余运算符
  let div2 = [...dom]
  console.log(Array.isArray(div2))//true

  // Array.prototype.slice.call()
  let div3 = Array.prototype.slice.call(dom)
  console.log(Array.isArray(div3))//true

  // fill() 用固定值填充数组
  const arr4 = new Array(5)
  arr4.fill('李')
  console.log(arr4)

  // [)
  arr4.fill('hello', 1, 3)
  console.log(arr4) //[李', 'hello', 'hello', '李', '李']

  let name = '孙'
  let str = `${name}\n换行\t空格`
  console.log(str)
</script>

</html>